<template>
	<view class="layout">
		<!-- 导航栏 -->
		<navgate-bar-vue :isBack="false" title="收藏"></navgate-bar-vue>

		<view class="vito-layout" v-for="(item, index) in rankingFrom" :key="index">
			<vito-vue :data="item"></vito-vue>
			<view class="line"></view>
		</view>
	</view>
</template>
<script setup>
	import {
		ref,
	} from 'vue';
	import {
		AppGetFavoriteAllApi
	} from '@/api/index';
	import {
		useUserStore
	} from '@/store';
	import {
		onShow
	} from '@dcloudio/uni-app'; // 正确导入路径

	// 获取本地数据
	const userStore = useUserStore();

	const userId = ref(null);

	userId.value = userStore.id;


	// 请求榜单数据
	const rankingFrom = ref([]);

	// 获取排行榜数据
	const getRankingInfo = async () => {
		const response = await AppGetFavoriteAllApi(userId.value);
		if (response && response.data) {
			rankingFrom.value = response.data;
		}
	};

	// 页面加载时调用函数
	onShow(() => {
		getRankingInfo();
	});
</script>


<style lang="scss" scoped>
	.layout {
		background-color: #fff;
		height: 100vh;

		.search-layout {
			margin-top: 20rpx;
			display: flex;
			justify-content: center;
			align-items: center;

			.search {
				display: flex;
				justify-content: center;
				align-items: center;
				width: 720rpx;
				height: 80rpx;
				border-radius: 30rpx;
				background-color: #eee;

				.search-logo {
					width: 45rpx;
					height: 45rpx;
				}

				.input {
					margin-left: 15rpx;
					width: 500rpx;
				}
			}
		}

	}

	.vito-layout {
		width: 100%;
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
	}

	.line {
		margin-top: 10rpx;
		width: 100%;
		border: 2rpx solid #ccc;
	}
</style>